const e = `<!--
 * @Description:
-->
<template>
  <s-form label-width="12em">
    <s-form-item label="是否可复选">
      <s-switch v-model="treeOptions.checkable"></s-switch>
    </s-form-item>
    <s-form-item label="是否可选择">
      <s-switch v-model="treeOptions.selectable"></s-switch>
    </s-form-item>
    <s-form-item label="是否默认展开">
      <s-switch v-model="treeOptions.initExpand"></s-switch>
    </s-form-item>
    <s-form-item label="是否联动">
      <s-switch v-model="treeOptions.linkage"></s-switch>
    </s-form-item>
    <s-form-item label="是否自定义节点文本">
      <s-switch v-model="treeOptions.customLabel"></s-switch>
    </s-form-item>
    <s-form-item label="树形组件示例">
      <s-tree
        :data="treeOptions.lazy ? lazyTreeData : treeData"
        :keys="{ id: 'value', label: 'label' }"
        :lazy="treeOptions.lazy"
        :load="handleTreeLoad"
        :checkable="treeOptions.checkable"
        :selectable="treeOptions.selectable"
        :linkage="treeOptions.linkage"
        :init-expand="treeOptions.initExpand"
      >
        <template v-if="treeOptions.customLabel" #label="{ node }">
          {{ node.label }}（{{ node.value }}）
        </template>
      </s-tree>
    </s-form-item>
  </s-form>
</template>

<script lang="ts">
import type { TreeLazyLoadResolve, TreeNodeConfig } from "@smartcity/simple-ui";
import BUTILS from "@smartcity/universal-utils-browser";
import { Component, Vue } from "vue-property-decorator";

@Component({
  name: "DefaultTree",
})
export default class DefaultTree extends Vue {
  /**
   * @description: 计时器索引
   * @private
   * @type {number}
   */
  timeout?: ReturnType<typeof setTimeout>;

  /**
   * @description: 树形组件配置项
   * @private
   * @readonly
   * @type {Object}
   */
  treeOptions = {
    selectable: false, // 是否可选择
    checkable: false, // 是否可复选
    initExpand: false, // 是否默认展开
    linkage: false, // 是否联动
    lazy: false, // 是否懒加载
    customLabel: false, // 自定义节点文本
  };

  /**
   * @description: 下拉框选项列表
   * @private
   * @readonly
   * @type {Array<Object>}
   */
  readonly treeData: any[] = [
    {
      label: "北京市",
      value: "110000000000",
      isLeaf: true,
    },
    {
      label: "江苏省",
      value: "320000000000",
      isLeaf: false,
      children: [
        {
          label: "南京市",
          value: "320100000000",
          isLeaf: false,
          children: [
            {
              label: "市辖区",
              value: "320101000000",
              isLeaf: true,
            },
            {
              label: "玄武区",
              value: "320102000000",
              isLeaf: true,
            },
            {
              label: "秦淮区",
              value: "320104000000",
              isLeaf: true,
            },
            {
              label: "建邺区",
              value: "320105000000",
              isLeaf: true,
            },
            {
              label: "鼓楼区",
              value: "320106000000",
              isLeaf: true,
            },
            {
              label: "浦口区",
              value: "320111000000",
              isLeaf: true,
            },
            {
              label: "栖霞区",
              value: "320113000000",
              isLeaf: true,
            },
            {
              label: "雨花台区",
              value: "320114000000",
              isLeaf: true,
            },
            {
              label: "江宁区",
              value: "320115000000",
              isLeaf: true,
            },
            {
              label: "六合区",
              value: "320116000000",
              isLeaf: true,
            },
            {
              label: "溧水区",
              value: "320117000000",
              isLeaf: true,
            },
            {
              label: "高淳区",
              value: "320118000000",
              isLeaf: true,
            },
          ],
        },
        {
          label: "无锡市",
          value: "320200000000",
          isLeaf: true,
        },
        {
          label: "徐州市",
          value: "320300000000",
          isLeaf: true,
        },
        {
          label: "常州市",
          value: "320400000000",
          isLeaf: true,
        },
        {
          label: "苏州市",
          value: "320500000000",
          isLeaf: true,
        },
        {
          label: "南通市",
          value: "320600000000",
          isLeaf: true,
        },
        {
          label: "连云港市",
          value: "320700000000",
          isLeaf: true,
        },
        {
          label: "淮安市",
          value: "320800000000",
          isLeaf: true,
        },
        {
          label: "盐城市",
          value: "320900000000",
          isLeaf: true,
        },
        {
          label: "扬州市",
          value: "321000000000",
          isLeaf: true,
        },
        {
          label: "镇江市",
          value: "321100000000",
          isLeaf: true,
        },
        {
          label: "泰州市",
          value: "321200000000",
          isLeaf: true,
        },
        {
          label: "宿迁市",
          value: "321300000000",
          isLeaf: true,
        },
      ],
    },
  ];

  readonly lazyTreeData = [
    {
      label: "北京市",
      value: "110000000000",
      isLeaf: true,
    },
    {
      label: "江苏省",
      value: "320000000000",
      isLeaf: false,
    },
  ];

  /**
   * @description: 生民周期函数
   * @private
   * @readonly
   */
  beforeDestroy(): void {
    if (this.timeout) {
      clearTimeout(this.timeout);
    }
  }

  /**
   * @description: 懒加载函数
   * @private
   * @param {TreeNodeConfig} node 当前树节点
   * @param {TreeLazyLoadResolve} resolve 懒加载函数回调
   * @returns
   */
  handleTreeLoad(node: TreeNodeConfig, resolve: TreeLazyLoadResolve): void {
    // 使用定时器模拟懒加载
    this.timeout = setTimeout(() => {
      resolve(
        BUTILS.Tree.findTreeNode(this.treeData, {
          targetKey: "value",
          targetValue: node.value,
        })?.children ?? [],
      );
      this.timeout = undefined;
    }, 2000);
  }
}
<\/script>
`; export { e as default };
